<template>
	<slot
		:controller="controller"
		:store="store"
		:model="model"
		:singleSelect="singleSelect"
		:localMode="localMode"
		:rowActiveMode="rowActiveMode"
		:actions="{
			handleCustomCallBack,
			handleRowClick,
			handleRowDbClick,
			handleSelectionChange,
			handleSortChange,
			handlePaginationChange,
			handleFilterChange,
			handleActionClick,
		}"
	>
		<div :class="classNames" :id="controlID">
			<a-form class="control-content">
				<AppGrid
					v-bind="$attrs"
					:columns="model.columns"
					:aggData="store.aggData"
					:items="controller.getDataSource()"
					:singleSelect="singleSelect"
					:localMode="localMode"
					:selections="store.selections"
					:showHeader="model.showHeader"
					:current="store.curPage"
					:limit="store.limit"
					:columnFilter="store.columnFilter"
					:totalRecord="store.totalRecord"
					:context="store.context"
					:viewParams="store.viewParams"
					:enableRowEdit="model.enableRowEdit"
					:enableAgg="model.aggMode !== 'NONE'"
					:rowActiveMode="rowActiveMode"
					:customCallBack="handleCustomCallBack()"
					:paging="model.paging"
					@row-click="handleRowClick"
					@row-db-click="handleRowDbClick"
					@selection-change="handleSelectionChange"
					@add-item="() => controller.newRow()"
					@remove-item="(row: IParam, index: number) => handleRemove([row])"
					@sort-change="(field: string, dir: '' | 'asc' | 'desc') => handleSortChange(controller, field, dir)"
					@pagination-change="(args: any) => handlePaginationChange(controller, args)"
					@column-filter-change="handleFilterChange"
					@action-click="(logic: any, data: IParam, event: MouseEvent) => handleActionClick(controller, logic as IViewLogicInput, data, event)"
				>
					<template
						v-slot:[slotName]="{
							record,
							column,
							text,
							index,
							title,
							actions,
							aggData,
							columns,
							emptyText,
						}"
						v-for="slotName of slotKeys"
					>
						<slot
							:controller="controller"
							:store="store"
							:model="model"
							:name="slotName"
							:record="record"
							:column="column"
							:text="text"
							:title="title"
							:index="index"
							:context="context"
							:viewParams="viewParams"
							:aggData="aggData"
							:columns="columns"
							:emptyText="emptyText"
							:actions="actions"
						>
						</slot>
					</template>
				</AppGrid>
			</a-form>
		</div>
	</slot>
</template>
<script setup lang="ts">
// 基于template/src/widgets/{{appEntities}}/{{ctrls@GRID}}-grid/{{spinalCase ctrl.codeName}}-grid-base.vue.hbs生成

import { AppGrid } from '@components/widgets/grid';
import { AppGridColumn, AppGridColumnHeader } from '@components/widgets/grid';
import { useProps, useBasic, useAction, useController } from './main-grid-hook';
import {
	GridActionType,
	IGridAbility,
	IGridStore,
	IParam,
	IViewLogicInput,
} from '@/core/interface';
// 输入参数
const props = defineProps(useProps());

// 基础数据
const {
	controlID,
	slotKeys,
	getClassNames,
	model,
	useNavParamsBind,
	useEventBind,
	handleActionClick,
	handlePaginationChange,
	handleSortChange,
	handleComponentAction,
} = useBasic(props);

const emit = defineEmits<{
	(
		event: 'ctrl-action',
		name: string,
		action: GridActionType,
		data: IParam[]
	): void;
	(event: 'ctrl-init', name: string, data: IGridAbility): void;
	(event: 'ctrl-destroy', name: string, data: IParam): void;
}>();

const evt = useEventBind(emit);
//  部件样式名
const classNames = computed(() => {
	return getClassNames(props);
});

//  表格控制器
const controller = useController(props, evt, { controlID });

useNavParamsBind(controller, props);

const store: IGridStore = controller.getStore();

const ctrlService = controller.getCtrlService();

const {
	handleRowClick,
	handleFilterChange,
	handleRowDbClick,
	handleSelectionChange,
	handleCustomCallBack,
	handleRemove,
} = useAction(controller);

onMounted(() => {
	controller.ctrlMounted();
});
onUnmounted(() => {
	controller.ctrlDestroy();
});
</script>
